import React, { Component } from "react";

export default class Footer extends Component {
  render() {
    return (
      <div
        style={{
          display: "flex",
          justifyContent: "left",
          width: "300px",
          paddingInlineStart: "10px",
          flexDirection: "row",
          alignItems: "center",
        }}
      >
        <input
          type="checkbox"
          value={this.props.isAllChecked}
          onChange={() => this.props.changeAllChecked()}
        ></input>
        <p style={{ paddingLeft: "30px" }}>
          已完成{this.props.nowCheckedNum} / 全部{this.props.allNum}
        </p>
        <button
          style={{
            backgroundColor: "red",
            marginLeft: "15px",
            height: "25px",
            borderRadius: "5px",
          }}
          onClick={() => {
            this.props.deleteSome();
          }}
        >
          删除已完成项目
        </button>
      </div>
    );
  }
}
